<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>

    <title>项目立项经费预算新增/修改弹窗页面</title>

    <div th:replace="common/common.html :: common_resource"></div>

</head>

<body class="gray-bg">

<div th:fragment="addFunds">
<div id="modal-form-funds" class="modal fade" aria-hidden="true">
    <div class="modal-dialog" style="width:64%;">
        <div class="modal-content">
            <div class="modal-body">
                <div class="row">
                    <div class="col-sm-2 b-r"></div>
                    <div class="col-sm-5 b-l">
                        <h3 class="m-t-none m-b" style="margin-bottom:30px"><i class="fa fa-paste"></i>
                            <span id="nameFunds"> 新增(修改) 项目立项经费预算</span>
                        </h3>

                        <form th:action="@{/funds/addEditFunds}" method="post">
                            <div class="form-group">
                                <label>经费预算编号：</label>
                                <input type="text" id="fundsId" name="fundsId" placeholder="请输入经费预算编号" class="form-control">
                            </div>
                            <div class="form-group">
                                <label>项目立项编号：</label>
                                <input type="text" id="projectIdFunds" name="projectId" placeholder="请输入项目立项编号" class="form-control">
                            </div>
                            <div class="form-group">
                                <label class="control-label">本年度指标：</label>
                                <div>
                                    <select class="form-control" id="budgetId" name="budgetId">
                                        <option id="selectBudget" value="">请选择指标</option>
                                        <span th:each="budget : ${budgetList}">
                                            <option th:id="${budget.getBudgetId()}" th:value="${budget.getBudgetId()}" th:text="${budget.getBudgetName()}" hassubinfo="true">文本</option>
                                        </span>
                                    </select>
                                </div>
                            </div>
                            <script th:inline="javascript">
                                $("#budgetId").blur(function(){   // 根据选择的省查询下面的市
                                    var budgetId = $('#budgetId option:selected').val();  // 获取选择的值
                                    var budgetList = [[${budgetList}]];
                                    for(var i=0; i<budgetList.length; i++){
                                        if(budgetList[i].budgetId == budgetId){
                                            document.getElementById("fundsMoney").value = budgetList[i].budgetMoney;
                                        }
                                    }
                                })
                            </script>
                            <div class="form-group">
                                <label>预算金额：</label>
                                <input type="text" id="fundsMoney" name="fundsMoney" class="form-control" data-mask="&yen; 9,999.99" placeholder="" readonly="readonly">
                            </div>
                            <div class="form-group">
                                <label>参赛注册费：</label>
                                <input type="text" id="moneyOne" name="moneyOne" class="form-control" data-mask="&yen; 9,999.99" placeholder="" >
                            </div>
                            <div class="form-group">
                                <label>差旅费：</label>
                                <input type="text" id="moneyTwo" name="moneyTwo" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>培训费：</label>
                                <input type="text" id="moneyThree" name="moneyThree" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>指导费：</label>
                                <input type="text" id="moneyFour" name="moneyFour" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>耗材费：</label>
                                <input type="text" id="moneyFive" name="moneyFive" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>教师奖金：</label>
                                <input type="text" id="moneySix" name="moneySix" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>其它：</label>
                                <input type="text" id="moneyOther" name="moneyOther" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>总金额：</label>
                                <input type="text" id="moneyAll" name="moneyAll" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <div class="form-group">
                                <label>实际使用金额：</label>
                                <input type="text" id="fundsNowMoney" name="fundsNowMoney" class="form-control" data-mask="&yen; 9,999.99" placeholder="">
                            </div>
                            <script th:inline="javascript">
                                $('#moneyOne, #moneyTwo, #moneyThree, #moneyFour, #moneyFive, #moneySix, #moneyOther').bind('input propertychange', function() {
                                    var moneyOne = document.getElementById("moneyOne").value;
                                    var moneyTwo = document.getElementById("moneyTwo").value;
                                    var moneyThree = document.getElementById("moneyThree").value;
                                    var moneyFour = document.getElementById("moneyFour").value;
                                    var moneyFive = document.getElementById("moneyFive").value;
                                    var moneySix = document.getElementById("moneySix").value;
                                    var moneyOther = document.getElementById("moneyOther").value;
                                    document.getElementById("moneyAll").value =
                                            Number(moneyOne) + Number(moneyTwo) + Number(moneyThree) + Number(moneyFour) +
                                            Number(moneyFive) + Number(moneySix) + Number(moneyOther)
                                });
                            </script>
                            <div style="margin-top:20px;">
                                <button style="width:100px;margin-top:15px;margin-bottom:30px;"
                                        class="btn btn-sm btn-primary pull-left m-t-n-xs" type="submit">
                                    <strong>提交</strong>
                                </button>
                            </div>
                        </form>
                    </div>
                    <div class="col-sm-5 b-l"></div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

</body>

</html>
